<template>
    <el-dialog
        v-model="dialogVisible"
        title="任务详情"
        width="1200"
        :closeOnClickModal="false"
        appendToBody
        @close="close"
        @open="openInit"
    >
        <div v-loading="detailLoading">
            <el-descriptions border :column="6">
                <el-descriptions-item label="更新时间" :span="2">
                    {{ detail.updateTime }}
                </el-descriptions-item>

                <el-descriptions-item label="资产名称" :span="2">
                    {{ detail.assetName }}
                </el-descriptions-item>

                <el-descriptions-item label="资产编号" :span="2">
                    {{ detail.assetCode }}
                </el-descriptions-item>

                <el-descriptions-item label="资产类别" :span="2">
                    {{ detail.category }}
                </el-descriptions-item>

                <el-descriptions-item label="规格型号" :span="2">
                    {{ detail.spec }}
                </el-descriptions-item>

                <el-descriptions-item label="制造商" :span="2">
                    {{ detail.maker }}
                </el-descriptions-item>

                <el-descriptions-item label="厂家编号" :span="2">
                    {{ detail.makerCode }}
                </el-descriptions-item>

                <el-descriptions-item label="改变前数量" :span="2">
                    {{ detail.oldNum }}
                </el-descriptions-item>

                <el-descriptions-item label="改变后数量" :span="2">
                    {{ detail.newNum }}
                </el-descriptions-item>

                <el-descriptions-item label="改变数量" :span="2">
                    {{ detail.changeNum }}
                </el-descriptions-item>

                <el-descriptions-item label="创建人" :span="2">
                    {{ detail.createBy }}
                </el-descriptions-item>

                <el-descriptions-item label="创建时间" :span="2">
                    {{ detail.createTime }}
                </el-descriptions-item>

                <el-descriptions-item label="更新人" :span="2">
                    {{ detail.updateBy }}
                </el-descriptions-item>

                <el-descriptions-item label="备注" :span="2">
                    {{ detail.remark }}
                </el-descriptions-item>
            </el-descriptions>
        </div>
    </el-dialog>
</template>

<script setup name="AssetsInventoryChangeDetail">
import { getInstanceDetail } from '../service';

const detail = ref({});
const originRow = ref({});
const useApi = ref(false);
const dialogVisible = ref(false);
// 关闭
function close() {
    dialogVisible.value = false;
}

const detailLoading = ref(false);
async function infoById(detailId) {
    detailLoading.value = true;
    const result = await getInstanceDetail(detailId)
        .then((res) => res.data)
        .finally(() => {
            detailLoading.value = false;
        });
    detail.value = result;
}

function openInit() {
    if (useApi.value && originRow.value.id) {
        infoById(originRow.value.id);
    } else {
        detail.value = originRow.value;
    }
}
// 打开
function open(row, api = false) {
    useApi.value = api;
    originRow.value = row;
    dialogVisible.value = true;
}

defineExpose({
    open,
});
</script>

<style lang="scss" scoped>
::v-deep(.el-descriptions__label) {
    width: 100px;
    color: #909399 !important;
}

::v-deep(.el-descriptions__content) {
    width: 300px !important;
    box-sizing: border-box;
}
</style>
